/*----------------------------- 加载中 -------------------------------------*/

.loading {
    top: 1.8rem;
    text-align: center;
}
.loading__cat {
    width: 0.94rem;
    margin: 0 auto;
}
.loading__bar {
    width: 1.55rem;
    margin: .13rem auto .05rem;
}
.loading__num {
    font-size: .25rem;
    color: #fff;
}


/*----------------------------- 封面 -------------------------------------*/

.cover__btn {
    bottom: .325rem;
    left: 2.125rem;
    width: 1rem;
    height: .575rem;
    overflow: hidden;
    position: absolute;
    transform-origin: left top;
    -webkit-transform-origin: left top
}
.cover__btn img {
    height: 200%;
    animation-duration: .5s;
    -webkit-animation-direction: .5s;
    animation: btn .4s steps(1) infinite;
    -webkit-animation: btn .4s steps(1) infinite
}

@keyframes btn {
    0% {
        transform: translateY(0)
    }
    50% {
        transform: translateY(-.575rem)
    }
    100% {
        transform: translateY(-.575rem)
    }
}

@-webkit-keyframes btn {
    0% {
        -webkit-transform: translateY(0)
    }
    50% {
        -webkit-transform: translateY(-.575rem)
    }
    100% {
        -webkit-transform: translateY(-.575rem)
    }
}
.cover__prize-wrap {
    top: 0;
}
.cover__prize {
    top: .985rem;
    width: 1.84rem;
}
.cover__prize-bg {
    width: 1.84rem;
    height: 2.64rem;
}
.cover__prize-btn {
    width: .29rem;
    height: .29rem;
    margin: .19rem auto 0;
}
.cover__prize-img {
    width: 1.72rem;
    height: 1.42rem;
    z-index: 10;
    top: 1.14rem;
}
.cover__prize-img .prize-coupon_text {
    top: .305rem;
}

.cover__btn-prize {
    width: .71rem;
    height: .71rem;
    position: absolute;
    left: 1.79rem;
    top: 2.7rem;
    z-index: 10;
}
.cover__prize-wrap {
    z-index: 20;
}


/*----------------------------- P1 -------------------------------------*/

.p1__text {
    top: 1.25rem;
    text-align: center;
    color: #fff;
}

.p1__text h4 {
    font-size: .21rem;
}
.p1__text h4:first-child {
    margin-bottom: .16rem;
}
.p1__text h3 {
    font-size: .315rem;
    margin: .13rem 0 .2rem;
}
.p1__text h2 {
    font-size: .42rem;
    margin-top: .3rem;
}
.p1__text h2 span:nth-child(2) {
    margin: 0 .5rem;
}



/*----------------------------- p2 -------------------------------------*/
.p2__girl-1 {
    width: .75rem;
    height: .9rem;
    position: absolute;
    top: .96rem;
    left: 1.955rem;
    z-index: 10;
}
.p2__phone {
    width: .225rem;
    height: .275rem;
    overflow: hidden;
    position: absolute;
    top: 1.35rem;
    left: 1.21rem;
}
.p2__phone.light img {
    transform: translateY(-50%);
}
.p2__phone img {
    height: 200%;
}
.p2__girl-5 {
    width: .5rem;
    height: .5rem;
    position: absolute;
    top: 1.1rem;
    left: .52rem;
}
.p2__tips {
    position: absolute;
    left: 0;
    top: 0;
}
.p2__tips-1 {
    width: 1.45rem;
    height: 1.25rem;
    position: absolute;
    top: .245rem;
    left: 1.225rem;
    z-index: 20;
}
.p2__tips-2 {
    width: 1.45rem;
    height: 1.25rem;
    position: absolute;
    top: .245rem;
    left: 1.225rem;
    z-index: 20;
}
.p2__tips-3 {
    width: 2.5rem;
    height: 0.95rem;
    top: 2.14rem;
}
.p2__tips-3 .close {
    width: .3rem;
    height: .3rem;
    position: absolute;
    right: .07rem;
    top: 0.33rem;
}
.p2__tips-4 {
    width: 2.45rem;
    height: 0.75rem;
    left: .58rem;
}
.p2__tips-4 .close {
    width: .3rem;
    height: .3rem;
    position: absolute;
    right: 0;
    top: .13rem;
}
.p2__tips-5 {
    width: 2.55rem;
    height: 0.85rem;
    position: absolute;
    top: 3.33rem;
    left: .58rem;
}
.p2__tips-5 .close {
    width: .3rem;
    height: .3rem;
    position: absolute;
    right: 0;
    top: .2rem;
}
.p2__tips-6 {
    width: 2.8rem;
    height: 2.15rem;
    position: absolute;
    top: 1.23rem;
    left: .325rem;
    z-index: 20;
}
.p2__tips-6 .close {
    width: .165rem;
    height: .165rem;
    position: absolute;
    right: .45rem;
    top: .34rem;
}
.p2__tips-7 {
    width: 3.25rem;
    height: 2.7rem;
    top: 1.21rem;
    left: .05rem;
    z-index: 20;
    overflow: hidden;
    transform: scale(.3);
    animation: t2wm .6s steps(1) forwards;
    -webkit-animation: t2wm .6s steps(1) forwards
}
@keyframes t2wm {
    0% {
        transform: scale(0)
    }
    100% {
        transform: scale(1)
    }
}
@-webkit-keyframes t2wm {
    0% {
        -webkit-transform: scale(0)
    }
    100% {
        -webkit-transform: scale(1)
    }
}
.p2__tips-7 .code {
    width: .98rem;
    height: 1.02rem;
    position: absolute;
    top: .67rem;
    left: 50%;
    transform: translateX(-50%);
    margin-left: -.025rem;
}
.p2__tips-8 {
    width: 2.65rem;
    height: 2.15rem;
    position: absolute;
    top: 1.57rem;
    left:.305rem;
    z-index: 20;
}
.p2__tips-8 .close {
    width: .23rem;
    height: .23rem;
    position: absolute;
    left: 2.1rem;
    top: .33rem;
}
.p2__prop-1 {
    width: .625rem;
    height: .85rem;
    position: absolute;
    top: 1.29rem;
    left: 2.39rem;
    overflow: hidden;
}
.p2__prop-1 img {
    height: 200%;
}
.p2__prop-1.shake img {
    animation: prop1 .4s steps(1) infinite;
    -webkit-animation: prop1 .4s steps(1) infinite
}
@keyframes prop1 {
    0% {
        transform: translateY(0)
    }
    50% {
        transform: translateY(-.85rem)
    }
    100% {
        transform: translateY(-.85rem)
    }
}

@-webkit-keyframes prop1 {
    0% {
        -webkit-transform: translateY(0)
    }
    50% {
        -webkit-transform: translateY(-.85rem)
    }
    100% {
        -webkit-transform: translateY(-.85rem)
    }
}
.p2__prop-2 {
    width: 1.225rem;
    height: 2.6rem;
    position: absolute;
    bottom: 0;
    right: 0;
    overflow: hidden;
}
.p2__prop-2 img {
    width: 200%;
}
.p2__prop-2.shake img {
    height: 100%;
    width: 200%;
    animation: prop2 .4s steps(1) infinite;
    -webkit-animation: prop2 .4s steps(1) infinite
}
@keyframes prop2 {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(-1.225rem)
    }
    100% {
        transform: translateX(-1.225rem)
    }
}

@-webkit-keyframes prop2 {
    0% {
        -webkit-transform: translateX(0)
    }
    50% {
        -webkit-transform: translateX(-1.225rem)
    }
    100% {
        -webkit-transform: translateX(-1.225rem)
    }
}
.p2__prop-3 {
    width: 1.65rem;
    height: 1.55rem;
    position: absolute;
    bottom: .16rem;
    left: 0;
    overflow: hidden;
}
.p2__prop-3 img {
    height: 200%;
}
.p2__prop-3.shake img {
    height: 200%;
    animation: prop3 .4s steps(1) infinite;
    -webkit-animation: prop3 .4s steps(1) infinite
}
@keyframes prop3 {
    0% {
        transform: translateY(0)
    }
    50% {
        transform: translateY(-1.55rem)
    }
    100% {
        transform: translateY(-1.55rem)
    }
}

@-webkit-keyframes prop3 {
    0% {
        -webkit-transform: translateY(0)
    }
    50% {
        -webkit-transform: translateY(-1.55rem)
    }
    100% {
        -webkit-transform: translateY(-1.55rem)
    }
}


/*----------------------------- p4 -------------------------------------*/
.p4__tips > div {
    width: 2.4rem;
    height: 2.25rem;
    position: absolute;
}
.p4__tips-1 {
    top: 0;
    left: .51rem;
}
.p4__tips-2 {
    top: .08rem;
    right: 1.27rem;
}
.p4__tips-3 {
    top: 1.7rem;
    left: .8rem;
}
.p4__tips-4 {
    top: 1.85rem;
    left: .575rem;
}
.p4__tips-5 {
    top: -.025rem;
    left: .55rem;
}
.p4__tips-6 {
    top: -.005rem;
    left: -.2rem;
}
.p4__tips-7 {
    top: 2.59rem;
    left: 1.05rem;
}
.p4__tips-8 {
    top: 1.65rem;
    right: 1.22rem;
}
.p4__tips-9 {
    top: 1.19rem;
    left: .77rem;
}


/*----------------------------- p5 -------------------------------------*/
.p5-phone {
    width: .81rem;
    height: .625rem;
    position: absolute;
    transform-origin: center top;
    -webkit-transform-origin: center top;
}
.p5-phone img {
    animation-duration: .5s;
    -webkit-animation-direction: .5s;
    animation: phone .4s steps(1) infinite;
    -webkit-animation: phone .4s steps(1) infinite
}
@keyframes phone {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(-.05rem)
    }
    100% {
        transform: translateX(-.05rem)
    }
}

@-webkit-keyframes phone {
    0% {
        -webkit-transform: translateX(0)
    }
    50% {
        transform: translateX(-.05rem)
    }
    100% {
        transform: translateX(-.05rem)
    }
}

.p5__left-phone {
    top: 3.05rem;
    left: 1.05rem;
}
.p5__right-phone {
    top: 3.05rem;
    right: 1.05rem;
    transform: scaleX(-1);
}


/*----------------------------- p6 -------------------------------------*/
.girl-5 {
    width: .75rem;
    height: 2.2rem;
    position: absolute;
    top: 2.7rem;
    left: 1.5rem;
}
.girl-6 {
    width: .95rem;
    height: 1.95rem;
    position: absolute;
    top: 3rem;
    left: 1rem;
}
.boy-1 {
    width: .8rem;
    height: 1.125rem;
    position: absolute;
    top: .66rem;
    left: 1.2rem;
}




/*----------------------------- sceneA-B -------------------------------------*/
.scene__left {

}
.scene__left_cat {
    width: 1.2rem;
    height: .95rem;
    overflow: hidden;
    position: absolute;
    top: 1.55rem;
    left: -.1re,;
}
.scene__left_cat img {
    height: 200%;
}
.scene__left_cat.next img {
    transform: translateY(-50%);
}
.scene__left_tips-4 {
    width: 1.85rem;
    height: 1.75rem;
    position: absolute;
    top: 2.06rem;
    left: .05rem;
}
.scene__left_tips-5 {
    width: 1.85rem;
    height: 1.55rem;
    position: absolute;
    top: .285rem;
    left: .75rem;
}
.girl-3 {
    width: .925rem;
    height: 1.875rem;
    top: 3.185rem;
    left: 1.285rem;
    position: absolute;
}
.girl-4 {
    width: .675rem;
    height: 1.575rem;
    top: 1.37rem;
    right: .05rem;
    position: absolute;
}
.boy-2 {
    width: .725rem;
    height: 1.15rem;
    top: 3.35rem;
    left: 0rem;
    position: absolute;
}
.boy-4 {
    width: .55rem;
    height: .8rem;
    top: 2.2rem;
    left: .59rem;
    position: absolute;
}
.scene__right_tips-2 {
    width: 1.9rem;
    height: 2rem;
    position: absolute;
    top: .21rem;
    left: 1.125rem;
}
.scene__right_tips-4 {
    width: 2.1rem;
    height: 1.55rem;
    position: absolute;
    top: 2.255rem;
    left: .695rem;
}


/*----------------------------- sceneC -------------------------------------*/
.boy-5 {
    width: 1.1rem;
    height: 3.35rem;
    position: absolute;
    top: 1.2rem;
    left: 1.815rem;
}
.boy-6 {
    width: 1.1rem;
    height: 1.8rem;
    position: absolute;
    top: 2.99rem;
    left: 1.81rem;
}
.boy-7 {
    width: 1.8rem;
    height: 2.45rem;
    position: absolute;
    top: 2.35rem;
    left: 1.12rem;
}

.scene__left_tips-6 {
    width: 1.65rem;
    height: 1.5rem;
    position: absolute;
    top: .535rem;
    left: .325rem;
}
.scene__left_tips-7 {
    width: 1.85rem;
    height: 1.65rem;
    position: absolute;
    top: 1.415rem;
    left: .415rem;
}
.scene__left_tips-8 {
    width: 1.6rem;
    height: 1.8rem;
    position: absolute;
    top: .825rem;
    left: 1.125rem;
}

.girl-7,
.girl-14 {
    width: 2.25rem;
    height: 4.3rem;
    position: absolute;
    top: 1.65rem;
    left: -.1rem;
}
.girl-8 {
    width: 1.3rem;
    height: 4.3rem;
    position: absolute;
    top: 1.6rem;
    left: .36rem;
}
.scene__right_tips-5 {
    width: 1.75rem;
    height: 1.5rem;
    position: absolute;
    top: .625rem;
    left: 1.275rem;
}
.scene__right_tips-6 {
    width: 1.75rem;
    height: 1.5rem;
    position: absolute;
    top: .77rem;
    left: 1.28rem;
}
.scene__right_tips-7 {
    width: 1.75rem;
    height: 1.65rem;
    position: absolute;
    top: .24rem;
    left: 1.285rem;
}


/*----------------------------- pk -------------------------------------*/
.pk-btn {
    width: 1.5rem;
    height: 1.4rem;
    position: absolute;
}
.pk-ko {
    width: 4rem;
    height: 2.1rem;
    overflow: hidden;
    position: absolute;
    z-index: 50;
}
.pk-cat {
    width: 2.75rem;
    height: 1.95rem;
    overflow: hidden;
    position: absolute;
}
.pk-cat-tips {
    width: .95rem;
    height: 1rem;
    overflow: hidden;
    position: absolute;
}
.pk-blood {
    width: 2.56rem;
    height: .525rem;
    overflow: hidden;
    position: absolute;
    // background: url("../images/pk/pk_blood-1.png") no-repeat 0 0;
    background-size: cover;
}
.pk-blood .num {
    width: 100%;
    height: 100%;
    // background: url("../images/pk/pk_blood-2.png") no-repeat 0 0;
    background-size: cover;
}
.pk-blood.n_0 img {
    transform: translateY(-.525rem);
}
.pk-blood.n_25 img {
    transform: translateY(-.525rem);
}
.pk-blood.n_75 img {
    transform: translateY(-1.05rem);
}
.pk-blood img {
    height: 300%;
}

.girl-9 {
    width: 2.5rem;
    height: 3rem;
    position: absolute;
    left: .27rem;
    top: .8rem;
}
.girl-10 {
    width: 2.85rem;
    height: 2.75rem;
    position: absolute;
    left: -.23rem;
    top: 1.275rem;
}
.girl-13 {
    width: 2.15rem;
    height: 3rem;
    position: absolute;
    left: .65rem;
    top: .705rem;
}
.pk__left-text {
    width: 1.45rem;
    height: .4rem;
    position: absolute;
    top: 1.15rem;
    left: .41rem;
}
.pk__left-ko {
    top: 1.505rem;
    left: 1.225rem;
}
.pk__left-btn {
    top: 3.685rem;
    left: .425rem;
}
.pk__left-cat {
    top: 1.65rem;
    left: 2.225rem;
}
.pk__left-cat-1 {
    top: 1.69rem;
    left: 2.015rem;
}
.pk__left-cat-2 {
    top: 2.04rem;
    left: 1.83rem;
}
.pk__left-cat-3 {
    top: 2.025rem;
    left: 1.83rem;
}
.pk__left-cat-4 {
    top: 1.92rem;
    left: 1.83rem;
}
.pk__left-cat-tips {
    top: .72rem;
    left: 2.39rem;
    overflow: hidden;
}
.pk__left-cat-tips img {
    width: 300%;
    // height: 300%;
    height: 100%;
    animation: cat-tips .4s steps(1) infinite;
    -webkit-animation: cat-tips .4s steps(1) infinite
}
@keyframes cat-tips {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(-.95rem)
    }
    100% {
        transform: translateX(-1.9rem)
    }
}

@-webkit-keyframes cat-tips {
    0% {
        -webkit-transform: translateX(0)
    }
    50% {
        -webkit-transform: translateX(-.95rem)
    }
    100% {
        -webkit-transform: translateX(-1.9rem)
    }
}
.pk__left-blood {
    top: .3rem;
    left: .675rem;
    transform: scaleX(-1);
    background: url("../images/pk/pk_left_blood-1.png") no-repeat;
    background-size: cover;
}
.pk__left-blood .num {
    background: url("../images/pk/pk_left_blood-2.png") no-repeat;
    background-size: cover;
}

.pk__right-text {
    width: 1.45rem;
    height: .4rem;
    position: absolute;
    top: 1.15rem;
    left: 1.13rem;
}
.boy-8 {
    width: 2.55rem;
    height: 2.2rem;
    position: absolute;
    right: .15rem;
    top: 1.6rem;
}
.boy-9 {
    width: 2.5rem;
    height: 3.05rem;
    position: absolute;
    right: .25rem;
    top: .85rem;
}
.boy-12 {
    width: 2.5rem;
    height: 3rem;
    position: absolute;
    right: .15rem;
    top: .58rem;
}
.pk__right-fish {
    width: 2.5rem;
    height: 1.9rem;
    position: absolute;
    top: 1.225rem;
    left: .355rem;
}
.pk__right-ko {
    top: 1.505rem;
    right: 1.225rem;
}
.pk__right-btn {
    top: 3.685rem;
    right: .425rem;
}
.pk__right-cat {
    top: 1.65rem;
    right: 1.38rem;
}
.pk__right-cat-1 {
    top: 1.69rem;
    right: 1.635rem;
}
.pk__right-cat-2 {
    top: 2.04rem;
    right: 1.82rem;
}
.pk__right-cat-3 {
    top: 2.025rem;
    right: 1.82rem;
}
.pk__right-cat-4 {
    top: 1.92rem;
    right: 1.82rem;
}
.pk__right-cat-tips {
    top: .72rem;
    right: 3.06rem;
}
.pk__right-blood {
    top: .3rem;
    right: .63rem;
    background: url("../images/pk/pk_right_blood-1.png") no-repeat;
    background-size: cover;
}
.pk__right-blood .num {
    background: url("../images/pk/pk_right_blood-2.png") no-repeat;
    background-size: cover;
}

/*----------------------------- p8 -------------------------------------*/
.p8__text h3 {
    font-size: .415rem;
    color: #fff;
    margin-bottom: .2rem;
    // letter-spacing: .07rem;
}

.p8__text h3:last-of-type span {
    margin: 0 .01rem;
}

.p8__left_text {
    position: absolute;
    top: 1.32rem;
    right: 0;
    padding-right: .1rem;
    text-align: right;
}

.p8__right_text {
    position: absolute;
    top: 1.32rem;
    left: 0;
    padding-right: .1rem;
}

.p8__right_text h3 span.f-50 {
    font-size: .25rem;
}


/*----------------------------- p9 -------------------------------------*/
.p9-phone {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
}

.p9__left_phone-m {
    width: 3.9rem;
    height: 4rem;
    position: absolute;
    top: 1.04rem;
    left: 1.05rem;
}

.girl-11,
.girl-12 {
    width: 3rem;
    height: 4.8rem;
    overflow: hidden;
    position: absolute;
    top: 1.195rem;
    left: .245rem;
}

.p9__right_phone-m {
    width: 3.9rem;
    height: 4rem;
    position: absolute;
    top: 1.04rem;
    right: 1.45rem;
}
.boy-10,
.boy-11 {
    width: 3rem;
    height: 4.9rem;
    overflow: hidden;
    position: absolute;
    top: 1.065rem;
    right: .375rem;
}


/*----------------------------- p10 -------------------------------------*/
.p10__left_phone-s {
    width: 2.85rem;
    height: 2.85rem;
    position: absolute;
    top: 1.065rem;
    left: .195rem;
}
.p10__right_phone-m {
    width: 2.85rem;
    height: 2.85rem;
    top: .6rem;
}


/*----------------------------- p11 -------------------------------------*/
.p11-cat {
    width: 2.95rem;
    height: .95rem;
    overflow: hidden;
    position: absolute;
    left: -.24rem;
    bottom: 0;
}
.p11-cat img {
    width: 300%;
}
.p11-cat.shake img {
    width: 300%;
    height: 100%;
    animation: cat .6s steps(1) forwards;
    -webkit-animation: cat .6s steps(1) forwards; 
    animation-delay: .2s;
}
@keyframes cat {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(-2.95rem)
    }
    100% {
        transform: translateX(-5.9rem)
    }
}
@-webkit-keyframes cat {
    0% {
        -webkit-transform: translateX(0)
    }
    50% {
        transform: translateX(-2.95rem)
    }
    100% {
        transform: translateX(-5.9rem)
    }
}

.p11__btn-1 {
    width: 2.15rem;
    height: 2.5rem;
    top: .73rem;
}

.p11__tips-1 {
    width: 2.15rem;
    top: .73rem;
}
.p11__btn-2 {
    margin-top: .25rem;
}

.p11__tips-2 {
    top: 0;
}
.p11__btn-close {
    width: .3rem;
    height: .3rem;
    position: absolute;
    top: .07rem;
    left: .085rem;
}
.p11__share {
    width: 1.6rem;
    height: .3rem;
    position: absolute;
    top: .04rem;
    right: .05rem;
}
.p11__tips-success {
    width: 2.45rem;
    height: .75rem;
}
.p11__tips-success .tips-close {
    width: .23rem;
    height: .23rem;
    position: absolute;
    top: .15rem;
    right: .01rem;
}

.p11__prize-1 {
    width: 3.2rem;
    height: 4.35rem;
    position: absolute;
    top: 0;
    left: 0;
}
.p11__prize-1 .tips {
    top: .7rem;
}
.p11__prize-1 .button {
    top: 3.785rem;
}
.p11__prize-1 .prize-coupon_text {
    width: 1.64rem;
    height: .85rem;
    top: 1.665rem;
}
.p11__prize-1 .prize-coupon_text h2 {
    font-size: .305rem;
    padding: 0 0 .06rem .125rem;
}
.p11__prize-1 .prize-coupon_text span {
    font-size: .135rem;
}
.p11__prize-1 .prize-coupon_text p {
    font-size: .115rem;
}
.p11__prize-1 .prize-coupon_text p:first-of-type {
    margin-bottom: .03rem;
}

.p11__prize-2 {
    width: 3.2rem;
    height: 4.35rem;
    position: absolute;
    top: 0;
    left: 0;
}
.p11__prize-2 .prize {
    width: 2.2rem;
    height: 2.3rem;
    margin-top: .77rem;
}
.p11__prize-2 .tips {
    width: 2.8rem;
    top: .4rem;
}
.p11__prize-2 .input {
    top: 2.7rem;
}
.p11__prize-2 .input:last-of-type {
    top: 3.23rem;
}
.p11__prize-2 .tips2 {
    width: 1.6rem;
    height: .3rem;
    top: 3.785rem;
}
.p11__prize-2 .button {
    top: 4.23rem;
}


.p11__prize-5 .tips {
    width: 3rem;
    top: .48rem;
}
.p11__prize-5 .button {
    top: 3.35rem;
}
.p11__prize-5 .prize-code {
    top: 2.25rem;
    font-size: .18rem;
    letter-spacing: .02rem;
    text-align: center;
}
.p11__prize-5 .tips3 {
    width: 2.05rem;
    height: .2rem;
    top: 2.79rem;
    z-index: 10;
}


/*----------------------------- socket -------------------------------------*/
.socket__tips {
    top: .985rem;
    width: 1.84rem;
    overflow: hidden;
}
.socket__tips-text {
    position: absolute;
    top: .77rem;
    width: 1.72rem;
    height: 1.42rem;
    left: .05rem;
    color: #f;
    font-size: .24rem;
    line-height: 1.4em;
    display: flex;
    align-items: center;
    justify-content: center;
}
.socket__tips-bg {
    width: 1.84rem;
    height: 2.64rem;
    margin-top: -.3rem;
}
.socket__tips-btn {
    width: .29rem;
    height: .29rem;
    margin: .19rem auto 0;
}

/*-----------------------------音乐-------------------------------------*/

#music {
    position: absolute;
    width: .24rem;
    height: .24rem;
    left: .14rem;
    bottom: .12rem;
    z-index: 50000;
    visibility: hidden
}

.music {
    width: 100%;
    height: 100%;
    background: url(../images/music.png) no-repeat center bottom / 100%
}

.play {
    background-position: center top
}

#music>span {
    color: #fff;
    position: absolute;
    left: -.52rem;
    top: 0;
    line-height: .24rem;
    font-size: .14rem;
    opacity: 0;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear
}

#music>span.zshow {
    left: -.3rem;
    opacity: 1
}



